<template>
  <div class="check-result-list">
    <!-- <div class="add" @click="edit(form.ID)">编辑</div> -->
    <van-collapse
      v-model="activeNames"
      accordion
    >
      <template v-for="(item, index) in List">
        <van-collapse-item
          :name="index + 1"
          :key="index"
          class="check-result-item"
        >
          <template #title>
            <div class="checklist-title">
              <img
                class="title-logo"
                src="@/assets/Images/AppIcon/fragment_noticetype_3.png"
                alt=""
              />
              {{ item.DetailItemName }} | 共{{
                item.children.length
              }}个项目,已检查{{ item.checkIndex }}个项目
            </div>
          </template>

          <div
            class=""
            v-for="(innerItem, innerIndex) in item.children"
            :key="innerIndex"
          >
            <div
              style="word-break: break-all"
              class="color-gray1"
            >
              {{ innerIndex + 1 }}、{{ innerItem.DetailItemName }}
            </div>
            <van-cell-group
              :border="border"
              style="margin-top: 10px"
            >
              <van-field
                label="检查结果"
                class="input_text"
                :value="
                  innerItem.CheckResult == 'Y'
                    ? '符合'
                    : innerItem.CheckResult == 'N'
                    ? '不符合'
                    : innerItem.CheckResult == 'NA'
                    ? '不适用'
                    : '未检查'
                "
                readonly
              />
            </van-cell-group>

            <van-field
              v-if="innerItem.CheckResult == 'Y' && innerItem.Attachs"
              label="图片"
              class="input_text"
              readonly
            >
              <template #input>
                <eagle-image-preview :images="innerItem.Attachs"></eagle-image-preview>
              </template>
            </van-field>

            <van-field
              v-if="innerItem.CheckResult == 'Y'"
              v-model="innerItem.Remarks"
              label="检查情况"
              class="input_text"
              readonly
            >
            </van-field>

            <van-field
              v-if="innerItem.CheckResult == 'N' && innerItem.Attachs"
              label="隐患图片"
              class="input_text"
              readonly
            >
              <template #input>
                <eagle-image-preview :images="innerItem.Attachs">
                </eagle-image-preview>
              </template>
            </van-field>
            <van-field
              v-if="innerItem.CheckResult == 'N'"
              label="隐患区域"
              class="input_text"
              :value="innerItem.HiddenDangerArea"
              type="textarea"
              autosize
              rows="1"
              readonly
            />
            <van-field
              v-if="innerItem.CheckResult == 'N'"
              label="隐患详细地点"
              class="input_text"
              :value="innerItem.HiddenDangerAddress"
              type="textarea"
              autosize
              rows="1"
              readonly
            />
            <van-field
              v-if="innerItem.CheckResult == 'N'"
              label="隐患描述"
              class="input_text"
              :value="innerItem.HiddenDangerDesc"
              type="textarea"
              autosize
              rows="1"
              readonly
            />
            <van-field
              v-if="innerItem.CheckResult == 'N'"
              label="隐患分类"
              class="input_text"
              :value="innerItem.LGDFullName"
              readonly
            />
            <!-- <van-field
              v-if="innerItem.CheckResult == 'N'"
              label="严重度"
              class="input_text"
              :value="innerItem.HiddenDangerType == 2 ? '重大隐患' : '一般隐患'"
              readonly
            /> -->

            <van-field
              label="直接责任人"
              class="input_text"
              :value="innerItem.PersonInChargeChnName"
              readonly
            />
            <van-field
              v-if="innerItem.CheckResult == 'N'"
              label="整改人"
              class="input_text"
              :value="getCorrectiveText(innerItem)"
              readonly
            />
            <van-field
              v-if="innerItem.CheckResult == 'N'"
              label="整改期限"
              class="input_text"
              :value="getDate(innerItem.CorrectiveDate)"
              readonly
            />
            <template v-if="innerItem.CheckResult && innerItem.Type == '1'">
              <van-field
                v-model="innerItem.OrderNo"
                label="物料批次信息1"
                class="input_text"
                readonly
              >
              </van-field>
              <van-field
                v-model="innerItem.Spec"
                v-if="innerItem.Spec"
                label="物料批次信息2"
                class="input_text"
                readonly
              >
              </van-field>
              <van-field
                v-model="innerItem.Model"
                v-if="innerItem.Model"
                label="物料批次信息3"
                class="input_text"
                readonly
              >
              </van-field>
              <van-field
                v-model="innerItem.Model2"
                v-if="innerItem.Model2"
                label="物料批次信息4"
                class="input_text"
                readonly
              >
              </van-field>
              <van-field
                v-model="innerItem.Model3"
                v-if="innerItem.Model3"
                label="物料批次信息5"
                class="input_text"
                readonly
              >
              </van-field>
            </template>
            <template v-if="innerItem.CheckResult && innerItem.Type == '2'">
              <van-field
                v-model="innerItem.VideoRange"
                class="input_text"
                label="视频查询时间段"
                readonly
              >
              </van-field>
              <van-field
                v-model="innerItem.SearchResult"
                label="搜索结果"
                class="input_text"
                readonly
              >
              </van-field>
              <van-field
                v-model="innerItem.BreakDesc"
                label="违规详情"
                class="input_text"
                rows="3"
                autosize
                type="textarea"
                readonly
              >
              </van-field>
            </template>

            <van-divider />
          </div>
        </van-collapse-item>
      </template>
    </van-collapse>
  </div>
</template>

<script>
import { getDetailTemplateData } from "@/api/sytech/sytechDangerCheckTaskDetail";
import { getDate, formatDate } from "@/utils/getDate";
export default {
  data() {
    return {
      tCode: this.$route.query.tCode,
      tRand: this.$route.query.tRand,
      List: [],
      border: false,
      fileList: [],
      activeNames: 1,
      showCalendar: false,
      selectKey: "",
    };
  },
  created() {
    this.getDetail();
  },
  methods: {
    getCorrectiveText(item) {
      if (item.CorrectiveChnName && item.CorrectiveDeptName) {
        return item.CorrectiveDeptName + "-" + item.CorrectiveChnName;
      } else if (item.CorrectiveDeptName) {
        return item.CorrectiveDeptName;
      }
      return item.CorrectiveChnName;
    },
    getDate(value) {
      return getDate(value);
    },
    handleShow(name) {
      this.showCalendar = true;
      this.selectKey = name;
    },
    onConfirm(date) {
      const dateTime = formatDate(date);
      this.selectKey.CorrectiveDate = getDate(dateTime);
      this.showCalendar = false;
    },

    getDetail() {
      let params = { tCode: this.tCode, tRand: this.tRand };
      getDetailTemplateData(params).then((res) => {
        let newList = [];
        res.data.map((item, index) => {
          let innerobj = {};
          if (item.ID === -1) {
            innerobj = item;
            let checkIndex = 0;
            innerobj.children = [];
            res.data.map((innerItem, innerIndex) => {
              if (innerItem.SEQ === item.SEQ && innerItem.ID != -1) {
                if (innerItem.CheckResult != null) {
                  checkIndex++;
                }
                innerobj.children.push(innerItem);
                innerobj.checkIndex = checkIndex;
              }
            });
            newList.push(innerobj);
          }
        });
        this.List = newList;
        //   this.fileList = []
        //   this.fileList = JSON.parse( res.data.Attachs2)
        //  console.log('asdadsa',JSON.parse( res.data.Attachs2));
      });
    },
    goReview(ucCode) {
      this.$router.push({
        path: "ReviewList",
        query: { ucCode: ucCode },
      });
    },
    // 编辑
    edit(certId) {
      this.$router.push({
        path: "/Credential/Edit",
        query: { certId: certId },
      });
    },
    goLgdType(idx, innerIdx) {
      this.$router.push({
        path: "/SytechDanger/LgdType",
        query: { idx: idx, innerIdx: innerIdx },
      });
    },
    // handleCLick() {
    //   console.log("asdasdadsadasd", this.List);
    // },
    handleClick(index, innerIndex, CheckResult) {
      console.log("asdasdadsadasd", this.List);
      this.List.forEach((item, idx) => {
        if (index == idx) {
          item.children.forEach((v, i) => {
            if (i == innerIndex) {
              v.CheckResult = CheckResult;
            }
          });
        }
      });
    },
    // 员工信息
    goStaffInfo() {
      this.$router.push("/Site_RiskUnit/StaffInfo");
    },
    // 检查记录
    goInspectRecord() {
      this.$router.push("/Site_RiskUnit/InspectRecord");
    },
    // 提交
    SaveCheckTaskTemplateDetails() {
      let newArr = [];
      this.List.forEach((item) => {
        if (item.children) {
          item.children.map((item1) => {
            item1.ID = 0;
            newArr.push(item1);
          });
        }
      });
      console.log(newArr, "newArr");
      return;
      SaveCheckTaskTemplateDetails(this.List, "2").then((res) => {
        console.log(res, "rerere");
      });
    },
  },
};
</script>

<style lang="less" scoped>
.checklist-title {
  display: flex;
  align-items: center;
}
.title-logo {
  width: 15px;
  height: 16px;
  margin-right: 10px;
}
// 符合按钮
.accord-btns {
  display: flex;
  align-items: center;
  justify-content: space-between;
  .accord-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30%;
    height: 22px;
    background-color: #fff;
    color: #666;
    font-size: 12px;
  }
  .active {
    background-color: #1989fa;
    color: #fff;
  }
  .inconformity {
    background-color: #ee0a24;
    color: #fff;
  }
  .not-applicable {
    background-color: #ff976a;
    color: #fff;
  }
}
.inconformity-list {
  background-color: #fff;
  margin-top: 10px;
  padding-top: 10px;
}
/*
        .main {
            height: 100vh;
        }
    */

.det_top_box {
  padding: 10px;
  background-color: #e8f1f8;
}

.detail_header {
  color: #ffffff;
  background: url("../../../assets/Images/AppIcon/image_riskunit_detail_bg.png");
  background-size: cover;
  padding: 10px;
  border-radius: 5px;
  /*background-color: #fff;*/

  .det_top {
    display: flex;
    justify-content: space-between;

    .dep_top_img {
      height: 20px;
      width: 20px;
      margin-right: 5px;
    }
  }

  .det_name {
    margin-top: 20px;
    text-align: center;
  }

  .det_location {
    text-align: center;
    margin-bottom: 20px;
  }
}
.det_tab {
  padding: 10px;
  .det_tab_item {
    padding: 10px 0;
    background-color: #fff;
    border-radius: 5px;
    margin-bottom: 10px;

    .det_tab_item_text {
      padding: 0 10px;
    }
  }
}

.text_box {
  padding: 10px;
  border-radius: 5px;
  /*background-color: #e8f1f8;*/
  margin-bottom: 10px;

  .text_top {
    margin-bottom: 10px;
    display: flex;
    justify-content: space-between;
    .top_link {
      color: #1989fa;
    }
  }

  .text_item {
    display: flex;
    justify-content: space-between;
    margin-left: 10px;

    .item_link {
      color: #1989fa;
    }
  }

  .text_img {
    display: flex;
    align-items: center;

    .img_item {
      width: 33.3%;
      text-align: center;

      img {
        height: 25px;
        width: 25px;
        margin-bottom: 10px;
      }
    }
  }

  .text_history {
    display: flex;
    vertical-align: middle;
    margin-bottom: 10px;
  }

  .text_member {
    color: #1989fa;
    margin-bottom: 10px;
  }

  .text_total_img {
    display: flex;
    align-items: center;

    .img_item {
      width: 33.3%;
      text-align: center;

      .img_item_top {
        display: flex;
        vertical-align: middle;
        margin-bottom: 10px;
      }
      img {
        height: 15px;
        width: 15px;
        margin-right: 5px;
      }
    }
  }
  .text_record_list {
    .list_row {
      display: flex;
      justify-content: space-between;
      margin-bottom: 10px;
      > div {
        width: 33.3%;
      }
      .row_center {
        text-align: center;
      }
      .row_right {
        text-align: right;
      }
    }
  }
}
.operate_det {
  background-color: #fff;
  padding: 10px;
  .operate_list {
    border: 1px solid #e8f1f8;
    .operate_row_first {
      padding: 10px;
      background-color: #e8f1f8;
      border-bottom: 1px solid #e8f1f8;
      margin-bottom: 10px;
    }
    .operate_row {
      padding: 10px;
      border-bottom: 1px solid #e8f1f8;
      /*margin-bottom: 10px;*/
    }
  }
}

.bottom-btns {
  width: 100%;
  position: fixed;
  bottom: 0;
  left: 0;
  .submit-btn,
  .save-btn {
    border: none;
    border-radius: 0;
  }
  .submit-btn {
    width: 70%;
  }
  .save-btn {
    width: 30%;
  }
}
.van-divider {
  border-color: #ccc;
}
</style>

<style lang="less">
.check-result-list {
  .van-collapse-item__content {
    background-color: #e8f1f8 !important;
    padding: 10px 10px 0px 10px;
  }
}
</style>>
